import Vue from 'vue'
import VueRouter from 'vue-router'
// 导入登入组件
import Login from '@/views/login/Login.vue'
import home from '@/views/home/home.vue'
import my from '@/views/home/my/my.vue'
import find from '@/views/home/find/find.vue'
import question from '@/views/home/question/question.vue'
import commpy from '@/views/home/commpy/commpy.vue'
import myInfo from '@/views/home/my/myInfo.vue'
import store from '@/store/index.js'
import { getLocal } from '@/utils/local.js'
import { getInfo } from '@/api/my.js'
Vue.use(VueRouter)

const routes = [
  { path: '/login', component: Login },
  // 重定向
  { path: '/', redirect: '/login' },
  {
    path: '/home',
    component: home,
    redirect: '/home/my',
    children: [
      {
        path: '/home/my',
        component: my,
        meta: { needLogin: true, needTab: true }
      },
      {
        path: '/home/question',
        component: question,
        meta: { needLogin: true, needTab: true }
      },
      { path: '/home/find', component: find, meta: { needTab: true } },
      { path: '/home/commpy', component: commpy, meta: { needTab: true } },
      { path: '/home/myInfo', component: myInfo, meta: { needLogin: true } }
    ]
  }
]

const router = new VueRouter({
  routes
})

// 前置导航守卫
router.beforeEach((to, from, next) => {
  // 判断是否需要登入(在路由元信息设置是否需要登入)
  window.console.log(to)
  if (!to.meta.needLogin) {
    // 不需要登入直接放行
    next()
  } else {
    // 需要登入的页面
    // 1 判断有没有登入
    if (store.state.isLogin) {
      // 登入了直接放行
      next()
    } else {
      // 没有登入判断有没有token  有token的话 就获取用户信息 避免每次刷新用户信息没啦
      // 没有token 就跳转到登入页
      if (getLocal('token')) {
        getInfo().then(res => {
          store.commit('setUserInfo', res.data.data)
          store.commit('setLoginState', true)

          next()
        })
      } else {
        // 回到登入页将参数也带回去 比如我们此时访问题库因为token问题等等 导致跳转登入页
        // 然后我们token过期了跳转到登入页 那么我们登入后应该回头题库页
        // 这样用户体验性好
        next('/login?redirect=' + to.fullPath)
      }
    }
  }
})
export default router
